@model BulkEditProductSearchModel

@{
    //page title
    ViewBag.Title = T("Admin.Catalog.BulkEdit").Text;
    //active menu item (system name)
    Html.SetActiveMenuItemSystemName("Products");
}

<form asp-controller="Product" asp-action="BulkEdit" method="post">
        <div class="content-header clearfix">
            <h1 class="pull-left">
                @T("Admin.Catalog.BulkEdit")
                <small>
                    <i class="fa fa-arrow-circle-left"></i>
                    <a asp-action="List">@T("Admin.Catalog.Products.BackToList")</a>
                </small>
            </h1>
            <div class="pull-right">
                &nbsp;
                @await Component.InvokeAsync("AdminWidget", new { widgetZone = AdminWidgetZones.ProductBulkEditButtons })
            </div>
        </div>

        <div class="content">
            <div class="form-horizontal">
                <div class="panel-group">
                    <div class="panel panel-default panel-search">
                        <div class="panel-body">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <div class="col-md-4">
                                            <nop-label asp-for="SearchProductName" />
                                        </div>
                                        <div class="col-md-8">
                                            <nop-editor asp-for="SearchProductName" />
                                        </div>
                                    </div>
                                    <div class="form-group" @(Model.AvailableCategories.SelectionIsNotPossible() ? Html.Raw("style=\"display:none\"") : null)>
                                        <div class="col-md-4">
                                            <nop-label asp-for="SearchCategoryId" />
                                        </div>
                                        <div class="col-md-8">
                                            <nop-select asp-for="SearchCategoryId" asp-items="Model.AvailableCategories" />
                                        </div>
                                    </div>
                                    <div class="form-group" @(Model.AvailableManufacturers.SelectionIsNotPossible() ? Html.Raw("style=\"display:none\"") : null)>
                                        <div class="col-md-4">
                                            <nop-label asp-for="SearchManufacturerId" />
                                        </div>
                                        <div class="col-md-8">
                                            <nop-select asp-for="SearchManufacturerId" asp-items="Model.AvailableManufacturers" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <div class="col-md-4">
                                            <nop-label asp-for="SearchProductTypeId" />
                                        </div>
                                        <div class="col-md-8">
                                            <nop-select asp-for="SearchProductTypeId" asp-items="Model.AvailableProductTypes" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <div class="col-md-8 col-md-offset-4">
                                            <button type="button" id="search-products" class="btn btn-primary btn-search">
                                                <i class="fa fa-search"></i>
                                                @T("Admin.Common.Search")
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="panel panel-default">
                        <div class="panel-body">
                            <div id="products-grid"></div>

                            <script>
                            $(document).ready(function() {
                                $("#products-grid").kendoGrid({
                                    dataSource: {
                                        type: "json",
                                        transport: {
                                            read: {
                                                url: "@Html.Raw(Url.Action("BulkEditSelect", "Product"))",
                                                type: "POST",
                                                dataType: "json",
                                                data: function() {
                                                    var data = {
                                                        SearchProductName: $('#@Html.IdFor(model => model.SearchProductName)').val(),
                                                        SearchCategoryId: $('#SearchCategoryId').val(),
                                                        SearchManufacturerId: $('#SearchManufacturerId').val(),
                                                        SearchProductTypeId: $('#SearchProductTypeId').val()
                                                    };
                                                    addAntiForgeryToken(data);
                                                    return data;
                                                }
                                            },
                                            update: {
                                                url: "@Html.Raw(Url.Action("BulkEditUpdate", "Product"))",
                                                type: "POST",
                                                dataType: "json"
                                            },
                                            destroy: {
                                                url: "@Html.Raw(Url.Action("BulkEditDelete", "Product"))",
                                                type: "POST",
                                                dataType: "json"
                                            },
                                            parameterMap: function(data, operation) {
                                                if (operation != "read") {
                                                    //post the entities so the ASP.NET DefaultModelBinder will understand them:
                                                    //products[0].Name="name"
                                                    //products[0].Id = 1
                                                    //products[1].Name="name"
                                                    //products[1].Id = 1

                                                    var result = {};

                                                    for (var i = 0; i < data.models.length; i++) {
                                                        var entity = data.models[i];

                                                        for (var member in entity) {
                                                            result["products[" + i + "]." + member] = entity[member];
                                                        }
                                                    }

                                                    addAntiForgeryToken(result);
                                                    return result;
                                                } else {
                                                    addAntiForgeryToken(data);
                                                    return data;
                                                }
                                            }
                                        },
                                        schema: {
                                            data: "Data",
                                            total: "Total",
                                            errors: "Errors",
                                            model: {
                                                id: "Id",
                                                fields: {
                                                    Name: { editable: true, type: "string" },
                                                    ProductId: { editable: false, type: "number" },
                                                    Sku: { editable: true, type: "string" },
                                                    Price: { editable: true, type: "number" },
                                                    OldPrice: { editable: true, type: "number" },
                                                    ManageInventoryMethod: { editable: false, type: "string" },
                                                    StockQuantity: { editable: true, type: "number" },
                                                    Published: { editable: true, type: "boolean" },
                                                    Id: { editable: false, type: "number" }
                                                }
                                            }
                                        },
                                        requestEnd: function (e) {
                                            if (e.type == "update") {
                                                this.read();
                                            }
                                        },
                                        error: function(e) {
                                            display_kendoui_grid_error(e);
                                            // Cancel the changes
                                            this.cancelChanges();
                                        },
                                        //bulk editing
                                        batch: true,
                                        pageSize: @(Model.PageSize),
                                        serverPaging: true,
                                        serverFiltering: true,
                                        serverSorting: true
                                    },
                                    pageable: {
                                        refresh: true,
                                        pageSizes: [@(Model.AvailablePageSizes)],
                                        @await Html.PartialAsync("_GridPagerMessages")
                                    },
                                    toolbar: [{ name: "save", text: "@T("Admin.Common.SaveChanges")" }, { name: "cancel", text: "@T("Admin.Common.CancelChanges")" }],
                                    editable: {
                                        confirmation: "@T("Admin.Common.DeleteConfirmation")",
                                        //bulk editing
                                        mode: "incell"
                                    },
                                    scrollable: false,
                                    columns: [ {
                                        field: "Name",
                                        title: "@T("Admin.Catalog.BulkEdit.Fields.Name")",
                                        width: 200
                                    }, {
                                        field: "ProductId",
                                        title: "@T("Admin.Common.View")",
                                        width: 100,
                                        headerAttributes: { style: "text-align:center" },
                                        attributes: { style: "text-align:center" },
                                        template: '<a class="btn btn-default" href="@Url.Content("~/Admin/Product/Edit/")#=Id#"><i class="fa fa-eye"></i>@T("Admin.Common.View")</a>'
                                    },{
                                        field: "Sku",
                                        title: "@T("Admin.Catalog.BulkEdit.Fields.Sku")",
                                        width: 150
                                    }, {
                                        field: "Price",
                                        title: "@T("Admin.Catalog.BulkEdit.Fields.Price")",
                                        width: 150,
                                        editor: function (container, options) {
                                            $('<input name="' + options.field + '"/>')
                                                .appendTo(container)
                                                .kendoNumericTextBox({
                                                    format: "{0:n4}",
                                                    decimals: 4
                                                });
                                        }
                                    }, {
                                        field: "OldPrice",
                                        title: "@T("Admin.Catalog.BulkEdit.Fields.OldPrice")",
                                        width: 150,
                                        editor: function (container, options) {
                                            $('<input name="' + options.field + '"/>')
                                                .appendTo(container)
                                                .kendoNumericTextBox({
                                                    format: "{0:n4}",
                                                    decimals: 4
                                                });
                                        }
                                    }, {
                                        field: "ManageInventoryMethod",
                                        title: "@T("Admin.Catalog.BulkEdit.Fields.ManageInventoryMethod")",
                                        width: 150
                                    }, {
                                        field: "StockQuantity",
                                        title: "@T("Admin.Catalog.BulkEdit.Fields.StockQuantity")",
                                        //integer format
                                        format: "{0:0}",
                                        width: 150
                                    },{
                                        field: "Published",
                                        title: "@T("Admin.Catalog.BulkEdit.Fields.Published")",
                                        width: 200
                                    }, {
                                        command: { name: "destroy", text: "@T("Admin.Common.Delete")" },
                                        title: "@T("Admin.Common.Delete")",
                                        width: 100
                                    }
                                    ]
                                } );
                            });
                            </script>

                            <script>
                            $(document).ready(function () {
                                $('#search-products').click(function () {
                                    var grid = $('#products-grid').data('kendoGrid');
                                    grid.dataSource.page(1); //new search. Set page size to 1
                                    //grid.dataSource.read(); we already loaded the grid above using "page" function
                                    return false;
                                });

                                $("#@Html.IdFor(model => model.SearchProductName)").keydown(function (event) {
                                    if (event.keyCode == 13) {
                                        $("#search-products").click();
                                        return false;
                                    }
                                });
                            });
                            </script>
                        </div>
                    </div>
                </div>
            </div>
        </div>
</form>